<template>
	<view>
		<uv-sticky>
			<view class="" style="display: flex;align-items: center;justify-content: space-around;height: 100rpx;line-height: 100rpx;background-color: #fff;">
				<view class="" @click="change(0)" :class="num==0?'active':''">
					品牌故事
				</view>
				<view class="" @click="change(1)" :class="num==1?'active':''">
					健康保障
				</view>
			</view>
		</uv-sticky>
		<view class="text0">
			<image style="width: 750rpx;vertical-align: top;" :src="pinpaiList[0].activityImgUrl" mode="widthFix"></image>
		</view>
		<view class="text1">
			<image style="width: 750rpx;vertical-align: top;" :src="jiankangList[0].activityImgUrl" mode="widthFix"></image>
		</view>
		
		<!-- <scroll-view scroll-y="true" :scroll-into-view="intoView" :style="`height: 200px`" scroll-with-animation="true">
			<image style="width: 750rpx;vertical-align: top;" :src="pinpaiList[0].activityImgUrl" mode="widthFix"></image>
		</scroll-view> -->
		<!-- <scroll-view scroll-y="true" :scroll-into-view="intoView" :style="`height: 200px`" scroll-with-animation="true">
			<image style="width: 750rpx;vertical-align: top;" :src="jiankangList[0].activityImgUrl" mode="widthFix"></image>
		</scroll-view> -->
		
	</view>
</template>

<script>
	import { getBusinessInfoList, getRecommen, getHomeDataInfo, getCategory, insertPlugsShopCart, userIsLogin } from '../../utils/api.js';
	export default {
		data() {
			return {
				pinpaiList:[],
				jiankangList:[],
				scrollHeight:0,
				intoView:'',
				num:0
			}
		},
		onPageScroll(res) {
			console.log(res.scrollTop); //距离页面顶部距离
			this.scrollHeight = res.scrollTop;
			
		},
		onShow() {
			this.getswiperList()
		},
		methods: {
			change(index){
				this.num=index
				if(index==0){
					
					              uni.pageScrollTo({
						            selector: '.text0',//你要跳转的样式位置
						            duration: 300,//跳转时间段
					             })
				}else{
					
						              uni.pageScrollTo({
							            selector: '.text1',//你要跳转的样式位置
							            duration: 300,//跳转时间段
						             })
				}
			},
			getswiperList() {
				let data = {
					businessId: -1
				};
				getRecommen(data).then(res => {
					if (res.code == 200) {
						// this.carouselList = res.body
						this.pinpaiList = res.body.filter(itm => itm.type === 'pinpai');
						this.jiankangList = res.body.filter(itm => itm.type === 'jiankang');
						console.log(this.pinpaiList );
						console.log(this.jiankangList );
					}
				});
			},
		}
	}
</script>

<style>
.active{
	color: #6c20d9;
}
</style>
